import { reactive, computed } from "vue";

const data = {
  areaList: [
    {
      id: NaN,
      img: "",
      name: "",
      alias_name: "",
      choose: NaN,
      is_start: NaN,
      end_point: [{ area_id: NaN, id: NaN, name: "" }],
      start_point: { area_id: NaN, id: NaN, name: "" },
      rotation_angle: 0,
    },
  ],
  crtAreaId: NaN,
  lineFilter: {
    start_point_id: NaN,
    start_area_id: NaN,
    end_point_id: NaN,
    end_area_id: NaN,
  },
};
const _data = JSON.parse(JSON.stringify(data));
const state = reactive(_data) as typeof data;
const crtArea = computed(() => {
  const obj = state.areaList.find((item) => +item.id === +state.crtAreaId);
  return obj || ({} as typeof state.areaList[number]);
});
const dftArea = computed(() => {
  const obj = state.areaList.find((item) => +item.choose === 1);
  return obj || ({} as typeof state.areaList[number]);
});

export { state as areaState, crtArea, dftArea };
